<template>
  <div class="page">
    <div class="containerInner">
      <div class="wrapper">
        <div class="header">
          <div class="group">
            <img
                class="iconUser"
                src="../assets/img/img_0.png"
            />
            <span class="chime">Pistachio</span>
          </div>
          <!--          导航栏提取-->
          <Navigation></Navigation>
          <!--          登陆注册栏提取-->
          <LoginBar class="login-bar"></LoginBar>
        </div>
        <div class="search">
          <!--          搜索框组件提取-->
          <SearchBar></SearchBar>
        </div>
        <div class="body">

          <Upload ref="fileUploadDialog"></Upload>

          <el-button
              type="primary"
              icon="el-icon-plus"
              size="mini"
              @click="dialogAdd"
          >上传
          </el-button>


        </div>
        <img
            class="logo"
            src="../assets/img/img_4.png"
        />
      </div>
    </div>
  </div>
</template>
<script>
import Navigation from "@/components/Navigation";
import LoginBar from "@/components/LoginBar";
import SearchBar from "@/components/SearchBar";
import Upload from "@/components/Upload";


export default {
  components: {
    Navigation,
    LoginBar,
    SearchBar,
    Upload,

  },
  data() {
    return {
      form: {noticeId: 0},
      notEdit: false
    }
  },
  methods: {
    toSearchPage() {
      this.$router.push('/searchPage')
    },

    // 点击上传按钮打开一个dialog
    dialogAdd(){
      this.$refs.fileUploadDialog.show()
    }

  },


}
</script>

<style src="./css/MusicCustomization.css" scoped/>
;
